<template>
  <div>
    <div class="bat-content-padded pt10 bat-celearfix h-auto">
      <!-- <h2 class="title bat-pull-left">批次信息</h2> -->
      <div class="pd10 bat-text-right bat-pull-right">
        <a @click="genPic2" class="bat-btn bat-btn-info">生成自定义图片</a>
        <!-- <a     @click='genPic' class="bat-btn bat-btn-info">生成图片</a> -->
      </div>
    </div>
    <div
      class="ml10 mr10 mt15"
      id="imgregon"
      style="background-color: #fff;height: auto;overflow: hidden;clear:both;"
    >
      <div class="bat-clearfix"></div>
      <table cellspacing="0" cellpadding="0" class="table" width="100%" style="border-bottom:0; ">
        <tr>
          <td colspan="6" width="20%" class="pal0 bl-none">
            <strong>轧花厂</strong>
          </td>
          <td colspan="18" width="80%" class="pal0">{{d.cFactory}}</td>
        </tr>
        <tr>
          <td colspan="6" width="20%" class="pal0 bl-none">
            <strong>组批批次</strong>
          </td>
          <td colspan="7" width="30%" class="pal0">
            <span class="num">{{d.cFactorybatchno}}</span>
          </td>
          <td colspan="5" width="20%">
            <strong>棉花类型</strong>
          </td>
          <td colspan="6" width="30%">{{d.cType}}</td>
        </tr>
        <tr>
          <td colspan="6" class="pal0 bl-none">
            <strong>合计毛重</strong>
          </td>
          <td colspan="7" class="pal0">
            <span class="num">{{fixValue(d.nGrossweight,1000,2)}}</span>吨
          </td>
          <td colspan="5">
            <strong>合计包数</strong>
          </td>
          <td colspan="6">
            <span class="num">{{d.nBagnum}}</span>
          </td>
        </tr>
        <tr>
          <td colspan="6" class="pal0 bl-none">
            <strong>合计皮重</strong>
          </td>
          <td colspan="7" class="pal0">
            <span class="num">{{d.nTareweight}}</span>千克
          </td>
          <td colspan="5">
            <strong>平均回潮</strong>
          </td>
          <td colspan="6">
            <strong class="orangecolor">{{d.nMoisture}}</strong>
          </td>
        </tr>
        <tr>
          <td colspan="6" class="pal0 bl-none">
            <strong>合计净重</strong>
          </td>
          <td colspan="7" class="pal0">
            <span class="num">{{fixValue(d.nNetweight,1000,2)}}</span>吨
          </td>
          <td colspan="5">
            <strong>平均含杂</strong>
          </td>
          <td colspan="6">
            <strong class="orangecolor">{{isJK?'':fixValue(d.nTrash,1,1)}}</strong>
          </td>
        </tr>
        <tr>
          <td colspan="6" class="pal0 bl-none">
            <strong>合计公重</strong>
          </td>
          <td colspan="7" class="pal0">
            <span class="num">{{fixValue(d.nStdweight,1,2)}}</span>吨
          </td>
          <td colspan="5">
            <strong>轧工质量</strong>
          </td>
          <td
            colspan="6"
            style="font-size:9px !important;"
          >P1:{{da.nGingoodProp}}&nbsp; P2:{{da.nGinmidProp}}&nbsp; P3:{{da.nGinbadProp}}</td>
        </tr>
        <tr>
          <td colspan="3" rowspan="13" class="bl-none lh20 spw2">
            <div style="width: 20px;margin:0 auto">
              <strong>各颜色比例(%)</strong>
            </div>
          </td>
          <td width="25%" colspan="6">白棉1级</td>
          <td colspan="4" width="12.5%">
            <span class="num">{{outPutNoZero(da.nColorgd11Prop)}}</span>
          </td>
          <td colspan="7" width="37.5%">
            <strong>长度平均值</strong>
          </td>
          <td colspan="4" width="12.5%">
            <strong class="orangecolor">{{da.nAvglength}}</strong>
          </td>
        </tr>
        <tr>
          <td colspan="6">白棉2级</td>
          <td colspan="4">
            <span class="num">{{da.nColorgd21Prop}}</span>
          </td>
          <td colspan="3" rowspan="8" class="lh20" width="12.5%">
            <div style="width: 20px;margin:0 auto">
              <strong>各长度值比例(%)</strong>
            </div>
          </td>
          <td colspan="4" width="25%">32mm</td>
          <td colspan="4" width="12.5%">
            <span class="num">{{outPutNoZero(da.nLengrade8Prop)}}</span>
          </td>
        </tr>
        <tr>
          <td colspan="6">白棉3级</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nColorgd31Prop)}}</span>
          </td>
          <td colspan="4">31mm</td>
          <td colspan="6">
            <span class="num">{{outPutNoZero(da.nLengrade7Prop)}}</span>
          </td>
        </tr>
        <tr>
          <td colspan="6">白棉4级</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nColorgd41Prop)}}</span>
          </td>
          <td colspan="4">30mm</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nLengrade6Prop)}}</span>
          </td>
        </tr>
        <tr>
          <td colspan="6">
            白棉5级
            <span></span>
          </td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nColorgd51Prop)}}</span>
          </td>
          <td colspan="4">29mm</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nLengrade5Prop)}}</span>
          </td>
        </tr>
        <tr>
          <td colspan="6">
            淡点污棉1级
            <span></span>
          </td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nColorgd12Prop)}}</span>
          </td>
          <td colspan="4">28mm</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nLengrade4Prop)}}</span>
          </td>
        </tr>
        <tr>
          <td colspan="6">
            淡点污棉2级
            <span></span>
          </td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nColorgd22Prop)}}</span>
          </td>
          <td colspan="4">27mm</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nLengrade3Prop)}}</span>
          </td>
        </tr>
        <tr>
          <td colspan="6">
            淡点污棉3级
            <span></span>
          </td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nColorgd32Prop)}}</span>
          </td>
          <td colspan="4">26mm</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nLengrade2Prop)}}</span>
          </td>
        </tr>
        <tr>
          <td colspan="6">淡黄染棉1级</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nColorgd13Prop)}}</span>
          </td>
          <td colspan="4">25mm</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nLengrade1Prop)}}</span>
          </td>
        </tr>
        <tr>
          <td colspan="6">淡黄染棉2级</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nColorgd23Prop)}}</span>
          </td>
          <td colspan="7">
            <strong>马值平均值</strong>
          </td>
          <td colspan="4">
            <strong class="orangecolor">{{d.nAvgmike}}</strong>
          </td>
        </tr>
        <tr>
          <td colspan="6">淡黄染棉3级</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nColorgd33Prop)}}</span>
          </td>
          <td colspan="3" rowspan="5" class="lh20">
            <div style="width: 24px;margin:0 auto;">
              <strong>马克隆值比例(%)</strong>
            </div>
          </td>
          <td colspan="4">C1</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nMikegradec1Prop)}}</span>
          </td>
        </tr>
        <tr>
          <td colspan="6">黄染棉1级</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nColorgd14Prop)}}</span>
          </td>
          <td colspan="4">B1</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nMikegradeb1Prop)}}</span>
          </td>
        </tr>
        <tr>
          <td colspan="6">黄染棉2级</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nColorgd24Prop)}}</span>
          </td>
          <td colspan="4">A</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nMikegradeaProp)}}</span>
          </td>
        </tr>
        <tr>
          <td colspan="3" rowspan="3" class="bl-none lh20">
            <div style="width: 24px;margin:0 auto;">
              <strong>长度整齐度(%)</strong>
            </div>
          </td>
          <td colspan="6" width="25%" style="height: 70px;">
            最小值
            <span></span>
          </td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nMinuniformity)}}</span>
          </td>
          <td colspan="4">
            B2
            <span></span>
          </td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nMikegradeb2Prop)}}</span>
          </td>
        </tr>
        <tr>
          <td colspan="6" style="height: 70px;">
            最大值
            <span></span>
          </td>
          <td colspan="4">
            <span class="num">{{da.nMaxuniformity}}</span>
          </td>
          <td colspan="4">
            C2
            <span></span>
          </td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(da.nMikegradec2Prop)}}</span>
          </td>
        </tr>
        <tr>
          <td colspan="6">平均值</td>
          <td colspan="4">
            <strong class="orangecolor">{{outPutNoZero(d.nAvguniformity)}}</strong>
          </td>
          <td colspan="3" rowspan="3" class="lh20">
            <div style="width: 44px;margin:0 auto;">
              <strong>断 裂 比 强 度</strong>
            </div>
            <!-- (cN/tex) -->
          </td>
          <td colspan="4" width="25%">最小值</td>
          <td colspan="4" width="12.5%">
            <span class="num">{{outPutNoZero(da.nMinintension)}}</span>
          </td>
        </tr>
        <tr>
          <td class="bl-none" colspan="3">+b</td>
          <td colspan="6">
            平均值
            <span></span>
          </td>
          <td colspan="4">
            <span class="num">{{da.nAvgpb}}</span>
          </td>
          <td colspan="4">最大值</td>
          <td colspan="5">
            <span class="num">{{outPutNoZero(da.nMaxintension)}}</span>
          </td>
        </tr>
        <tr>
          <td colspan="3" class="bl-none">Rd(%)</td>
          <td colspan="6">平均值</td>
          <td colspan="4">
            <span class="num">{{outPutNoZero(d.nAvgrd)}}</span>
          </td>
          <td colspan="4">平均值</td>
          <td colspan="4">
            <strong class="orangecolor">{{d.nAvgintension}}</strong>
          </td>
        </tr>
      </table>
      <table
        width="100%"
        cellspacing="0"
        cellpadding="0"
        class
        style="padding-top: 5px;"
        id="aboutus"
      >
        <td width="33%" style="vertical-align:top"></td>
        <td width="100%" class="bat-text-right" style="vertical-align:middle"></td>
        <td width="37%" class="bat-text-right" style="color:#555;"></td>
      </table>
      <p
        class="pt10 pb10 bat-text-right c000"
        style="font-size:12px !important"
        id="viewsite"
      >更多功能请访问www.icottontrade.com</p>
    </div>
    <van-popup class="popprice" v-model="showZDY">
      <div class="logo">
        <h4>我的Logo</h4>
        <img :src="logoUrl" alt>
        <van-button type="primary" @click="fileopen" size="small" class="pub">更换</van-button>
      </div>
      <van-cell-group>
        <van-field v-model="user.entname" required label="公司名称" placeholder="请输入公司名称"/>
        <van-field v-model="user.linktel" required label="联系电话" placeholder="请输入联系电话"/>
        <div data-v-adfc6d22 class="van-cell van-cell--required van-hairline van-field">
          <div class="van-cell__title">
            <span>重量单位</span>
          </div>
          <div class="van-cell__value">
            <div class="van-field__body">
              <van-radio-group class="inline" v-model="user.priceType">
                <van-radio name="公重">公重</van-radio>
                <van-radio name="毛重">毛重</van-radio>
              </van-radio-group>
            </div>
          </div>
        </div>
        <van-field v-model="user.price" required type="number" label="价格" placeholder="请输入价格"/>
      </van-cell-group>
      <div class="btnPrice">
        <van-button type="default" @click="showZDY=false;" size="small">取消</van-button>
        <van-button
          type="primary"
          @click="confirm"
          style="background:#2cb98e;border-color:##2cb98e;"
          class="ml1em"
          size="small"
        >确认</van-button>
      </div>
    </van-popup>
    <input
      type="file"
      name="file"
      id="file"
      @change="fileupdate"
      ref="inputer"
      accept="image/*"
      v-show="false"
    >
  </div>
</template>

<script>
import { Toast, Dialog } from "vant";
import api from "@/api/api";
export default {
  data() {
    return {
      isbuy: false,
      TradePrice: 0,
      showZDY: false,
      logoUrl: "",
      userList: {},
      user: {
        price: 0,
        entname: "",
        linktel: "",
        priceType: "公重"
      },
      file: [],
      d: {
        nGrossweight: 0,
        nTrash: 0,
        nNetweight: 0,
        nTareweight: 0,
        nStdweight: 0
      },
      da: {}
    };
  },
  computed: {
    isJK: function() {
      return this.d.BatchType == 2 || this.d.BatchType == 3;
    }
  },
  created() {
    if (this.$store.state.userInfo.logo) {
      this.logoUrl =
        "https://www.icottontrade.com/cot/Upload/mylogo/" +
        this.$store.state.userInfo.logo;
    } else {
      this.logoUrl = "https://www.icottontrade.com/cot/Upload/logo.jpg";
    }
  },
  methods: {
    showDialog(item) {
      Dialog.confirm({
        title: this.d.SellEntName,
        message: "您选择的是：" + (item.XM ? item.XM : item.phoneno),
        confirmButtonText: "电话联系",
        cancelButtonText: "站内私信",
        closeOnClickOverlay: true
      })
        .then(() => {
          // on confirm
          this.phonecall(this.d, item);
        })
        .catch(() => {
          // on cancel
          this.msg(item.ID);
        });
    },
    fileopen: function() {
      var fileSelect = document.getElementById("file");
      fileSelect.click();
    },
    fileupdate: function() {
      var that = this;
      if (!this.$store.state.userInfo.ID) {
        Toast("请先登录");
        return false;
      }
      let inputDOM = this.$refs.inputer;
      // 通过DOM取文件数据
      if (inputDOM.files.length == 0) {
        Dialog.alert({
          title: "提示",
          message: "请选择Excel文件或图片上传！"
        }).then(() => {
          return false;
        });
      }
      this.file = inputDOM.files[0];
      var formdata = new FormData();
      formdata.append("file", inputDOM.files[0]);
      let data = {
        EntName: this.$store.state.userInfo.EntName,
        UserID: this.$store.state.userInfo.ID
      };
      formdata.append("data", JSON.stringify(data));
      let config = {
        headers: {
          "Content-Type": "multipart/form-data"
        }
      };
      Toast.loading({
        mask: true,
        message: "正在上传..."
      });
      this.$http
        .post("/uploadUserLogo", formdata, config)
        .then(function(res) {
          Toast.clear();
          that.logoUrl =
            "https://www.icottontrade.com/cot/Upload/mylogo/" + res.data.data;
          var user = that.$store.state.userInfo;
          user.logo = res.data.data;
          that.$store.commit("setUserInfo", user);
          if (res.data.success) {
            Dialog.alert({
              title: "提示",
              message: "上传成功！"
            }).then(() => {
              var fileSelect = document.getElementById("file");
              fileSelect.value = "";
            });
          } else {
            Toast.fail(res.data.data);
          }
        })
        .catch(function(err) {
          console.log(err);
        });
    },
    onRead(file) {
      console.log(file);
      var that = this;
      let formData = new FormData();
      let data = {
        fileName: file.file.name,
        content: file.content,
        size: file.file.size,
        EntID: this.$store.state.userInfo.EntID,
        EntName: this.$store.state.userInfo.EntName,
        UserName: this.$store.state.userInfo.XM,
        UserID: this.$store.state.userInfo.ID
      };
      // formData.append('file', file.content);
      // formData.append('EntID', data.EntID);
      // formData.append('EntName', data.EntName);
      // formData.append('UserName', data.UserName);
      // formData.append('UserID', data.UserID);
      // formData.append('file', JSON.stringify(data));
      formData.append("file", file.file);
      let config = {
        headers: {
          "Content-Type": "multipart/form-data"
        }
      };
      console.log(file.file);
      that.$http.post("/addAttach", formData, config).then(function(res) {
        // that.fileNames.push(res.data.data);
        // that.fileList.push(that.webUrl + res.data.data);
      });
    },
    genPic2() {
      if (!this.$store.state.userInfo.phoneno) {
        Toast.fail("请先注册！");
        return;
      }
      this.user.entname = this.$store.state.userInfo.EntName;
      this.user.linktel = this.$store.state.userInfo.phoneno;
      this.user.price = this.d.SellPrice;
      this.showZDY = true;
    },
    confirm() {
      this.genPic();
    },
    genPic() {
      if (!this.$store.state.userInfo.phoneno) {
        Toast.fail("请先注册！");
        return;
      }
      // this.user.entname = this.$store.state.userInfo.EntName;
      // this.user.linktel = this.$store.state.userInfo.phoneno;
      var para = {
        UserID: this.$store.state.userInfo.ID,
        RowID: this.d.RowID,
        priceType: this.user.priceType
      };
      if (this.user.entname) {
        para.EntName = this.user.entname;
      }
      if (this.user.linktel) {
        para.LinkTel = this.user.linktel;
      }
      if (this.user.price) {
        para.Price = this.user.price;
      } else {
        para.Price = this.d.SellPrice;
      }

      this.$router.push(
        "/detailPic/" +
          this.d.cFactorybatchno +
          "?RowID=0" +
          "&EntName=" +
          encodeURI(para.EntName) +
          "&LinkTel=" +
          para.LinkTel +
          "&Price=" +
          para.Price +
          "&priceType=" +
          encodeURI(para.priceType)
      );
      return;
      // api.GenPic(para).then(res => {
      //   this.user.entname = "";
      //   this.user.linktel = "";
      //   this.user.price = 0;
      //   if (res) {
      //     this.$router.push("/user/viewPic?url=" + res);
      //   }
      // });
    },
    share() {
      var desc = "聚棉网为您推荐以下资源";
      var link =
        "https://www.icottontrade.com/%23/detail/" +
        this.d.cFactorybatchno +
        "?RowID=" +
        this.d.RowID;
      var url =
        "https://www.icottontrade.com/cot/redirect/go?url=" + encodeURI(link);
      console.log(this.logoUrl);
      wx.onMenuShareAppMessage({
        title: this.$store.state.userInfo.NickName + "为您推荐",
        desc: desc,
        link: url, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
        imgUrl: this.logoUrl, // 自定义图标
        type: "link", // 分享类型,music、video或link，不填默认为link
        dataUrl: "", // 如果type是music或video，则要提供数据链接，默认为空
        success: function() {
          // 用户确认分享后执行的回调函数
          Toast({
            message: "分享成功",
            duration: 1500
          });
        },
        cancel: function() {
          // 用户取消分享后执行的回调函数
        }
      });
      wx.onMenuShareTimeline({
        title: this.$store.state.userInfo.NickName + "为您推荐",
        link: link,
        imgUrl: this.logoUrl // 自定义图标
      });
    },
    buy() {
      this.isbuy = !this.isbuy;
      if (this.isbuy) {
        Toast({
          message: "加入收藏成功！",
          duration: 1500
        });
      }
    },
    msg(toUserID) {
      if (!toUserID) {
        Toast.fail("此信息由聚棉网发布！");
        return;
      }
      if (!this.$store.state.userInfo.ID) {
        Toast.fail("请先注册！");
        return;
      }
      this.$router.push(
        "/user/msg?FromUserID=" +
          toUserID +
          "&UserID=" +
          this.$store.state.userInfo.ID
      );
    },
    addToCart() {
      if (!this.$store.state.userInfo.phoneno) {
        Toast.fail("请先注册！");
        return;
      }
      var para = {
        BatchNo: this.d.cFactorybatchno,
        OpenID: this.$store.state.userInfo.OpenID,
        isInShopCart: this.d.isInShopCart
      };
      api.addToCard(para).then(res => {
        if (res.success) {
          Toast.success(res.msg);
          this.batch.isInShopCart = !this.batch.isInShopCart;
        } else {
          Toast.fail(res.msg);
        }
      });
    },
    outPutNoZero(v) {
      if (v) {
        if (parseFloat(v) == 0) {
          return "--";
        } else {
          return v;
        }
      } else {
        return "--";
      }
    },
    fixValue(s, iRate, n) {
      if (s) {
        return (s / iRate).toFixed(n);
      } else {
        return "--";
      }
    },
    phonecall(data, item) {
      let params = {
        EntID: this.$store.state.userInfo.EntID,
        EntName: this.$store.state.userInfo.EntName,
        UserName: this.$store.state.userInfo.XM
          ? this.$store.state.userInfo.XM
          : this.$store.state.userInfo.NickName,
        UserID: this.$store.state.userInfo.ID,
        OpenID: this.$store.state.userInfo.OpenID,
        UserTel: this.$store.state.userInfo.phoneno,
        cFactorybatchno: this.d.cFactorybatchno,
        LinkMan: item.XM,
        LinkTel: item.phoneno,
        LinkEntName: data.SellEntName,
        LinkEntID: data.SellEntID
      };
      api.addPhoneLog(params).then(res => {
        window.location.href = "tel://" + item.phoneno;
      });
    }
  },
  mounted() {
    var para = {
      BatchNo: this.$route.query.BatchNo
    };
    api.getBatchInfoSingle(para).then(res => {
      this.d = res.data;
      this.userList = res.userList;
      this.TradePrice = res.TradePrice;
      if (!this.d.nStdweight) {
        this.d.nGrossweight = 0;
        this.d.nNetweight = 0;
        this.d.nStdweight = 0;
      }
      this.da = res.dataAvg;
      //this.share();
    });
  }
};
</script>

<style scoped lang='less'>
.popprice {
  width: 80%;
  padding: 1em;
  .ml1em {
    margin-left: 1em;
  }
  .btnPrice {
    margin-top: 1em;
  }
  .inline {
    text-align: left;
    .van-radio {
      display: inline-block;
    }
  }
  .logo {
    text-align: center;
    img {
      height: 100px;
      width: 100px;
      border: 1px solid #ccc;
    }
  }
  h4 {
    line-height: 2em;
  }
  .pub {
    width: 50%;
    display: block;
    margin: 1em auto;
    background: #2cb98e;
    border: 1px solid #2cb98e;
  }
}
.price {
  height: 80px;
  margin: 10px 5px;
  border: 1px solid #000;
  background: #fff;
  display: flex;
  .btnbuy {
    font-size: 12px;
    background: #fff;
    border: 1px solid orange;
    padding: 0 1em;
    margin-top: 10px;
    height: 35px;
    line-height: 30px;
    font-weight: bold;
    width: 10em;
    color: orange;
    i {
      font-size: 22px;
      position: relative;
      top: 3px;
    }
  }
  .trade {
    line-height: 1.3em;
    font-size: 20px;
    font-weight: bold;
    padding: 5px 5px;
    > div {
      height: 1.3em;
    }
    > span {
      display: block;
      font-size: 14px;
    }
  }
  > div {
    margin: 10px;
    border-right: 1px solid #f2f2f2;
    text-align: center;
    b {
      line-height: 60px;
      font-size: 14px;
    }
    strong {
      font-size: 16px;
      display: block;
      color: red;
      margin-top: 10px;
    }
    span {
      font-size: 14px;
      display: block;
    }
  }
  > div:last-child {
    border: 0;
  }
}
.pt10 {
  padding-top: 10px;
  background: #fff;
}
.bat-content-padded {
  padding: 5px;
}
.pd10 {
  padding: 10px;
}
.bat-text-right {
  text-align: right;
}
.m5 {
  margin: 5px;
}
.mt15 {
  margin-top: 15px;
}
.mt10 {
  margin-top: 10px;
}
.bat-pull-left {
  float: left;
}
.bat-form {
  font-size: 14px;
  > div {
    border-bottom: 1px solid #ccc;
  }
}
.bat-pull-right {
  float: right;
}
.pl10 {
  padding-left: 10px;
}
.h100 {
  height: 100px;
}
.bat-card {
  border-radius: 0 !important;
  border-color: #666 !important;
  padding-right: 15px;
}
.bat-input-addon {
  font-size: 12px;
  color: #000 !important;
  display: inline-block;
  width: 6em;
}
.table {
  width: 100%;
  border: 1px #3a3333 solid;
  table-layout: fixed;
  margin: 0 15px 0 5px;
}
.table tr td {
  border-bottom: 1px #a29c9c solid;
  border-left: 1px #a29c9c solid;
  font-size: 12px;
  padding: 0;
  text-align: center;
  color: #000;
  height: 30px;
  vertical-align: middle;
}
.table tr td.lh20 {
  line-height: 33px;
}
.table2 tr:last-child td {
  border-bottom: 0;
  font-weight: bold;
  font-size: 16px !important;
}
.bat-input-addon,
.bat-input-row {
  font-size: 12px;
  span {
    width: 6em;
    padding-left: 5px;
  }
  .bat-input {
    float: right;
    padding-right: 5px;
    max-width: 18em;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }
}
.img_div {
  width: 691px;
  height: 960px;
}
.hide_html {
  display: none;
}
.bat-btn-info {
  border-radius: 50px;
  padding-left: 20px;
  padding-right: 20px;
}
.pr10 {
  padding-right: 10px;
}
.pt25 {
  padding-top: 25px;
}
.bat-btn {
  padding: 0.5em 0.8em;
  background: #2dbaba;
  color: #fff;
  font-size: 12px;
  margin-top: 10px;
}
.bat-nav,
.bat-nav .bat-bar-tab {
  height: 112px;
  background-color: #fff;
}
.bat-nav .bat-bar-tab .bat-iconfont {
  font-size: 22px;
  color: #8f8f94;
  padding-top: 17px;
  height: 60px;
  line-height: 30px;
  display: inline-block;
  font-size: 2em !important;
}
.bat-nav .bat-bar-tab li {
  padding-top: 10px;
  padding-bottom: 10px;
  line-height: 25px;
}
.bat-nav .bat-bar-tab li p {
  font-size: 24px !important;
}
.active-warning {
  background-color: #faa732;
  color: #fff;
  line-height: 32px;
  border: 0;
}
.title {
  font-size: 1rem !important;
  padding: 10px;
}
.bat-card {
  border: 1px #666 solid;
  border-radius: 5px !important;
}
.bat-input-addon,
.bat-input-row {
  height: 2.5em;
  line-height: 2.5em;
  text-align: left;
}
.price {
  font-size: 1.5em !important;
  color: #faa732 !important;
}
.bat-input-row .bat-input {
  text-align: right;
}
.s-td {
  display: block;
  width: 50%;
  height: 100%;
  text-align: center;
  float: left;
  line-height: 72px;
}
.s-td-bl {
  border-left: 1px #d0cdcd solid;
}
.bat-icon-favorfill {
  color: #faa732 !important;
}
.nonone {
  background: transparent;
  border: 0;
  padding: 0;
  margin: 0;
}
.bat-nav .bat-bar-tab .bat-iconfont {
  font-size: 1.7em !important;
}
footer .bat-bar-tab li a span.bat-label {
  padding: 1px 7px;
  top: 13px;
}
.tel-box {
  bottom: 132px;
  right: -16px;
  width: 143px;
  border-radius: 0;
  z-index: 11;
  line-height: 50px;
}
.tel-box i {
  font-size: 56px !important;
}
.tel-box span {
  font-size: 23px !important;
  width: 67px;
  line-height: 27px;
}
.bl-none {
  border-left: 0 !important;
}
.bb-none {
  border-bottom: 0 !important;
}
/* new */
.tb2 {
  border-width: 2px !important;
}
.tb2 tr td {
  border-bottom: 2px #000 solid !important;
  border-left: 2px #000 solid !important;
  font-size: 18px !important;
  height: 40px !important;
}
.tb2 tr td strong {
  font-size: 18px !important;
}
.tb2 tr td.bb-none {
  border-bottom: 0 !important;
}
.tb2 tr td.bl-none {
  border-left: 0 !important;
}
.tb2 tr td.lh20 {
  line-height: 20px;
}
.tb2 tr td.lh20 div {
  width: auto !important;
}
.table tr td.spw {
  width: 13% !important;
}
.defineinput {
  /*自定义input*/
  border: 0 !important;
  width: 100%;
  height: 100%;
  margin-bottom: 0 !important;
}
/* .table tr td.spw2{
                                                                width: 16% !important;
                                                            } */
table tr td .orangecolor {
  color: #cc0000 !important;
  font-size: 14px !important;
}
/* num 所有数字 控制 */
.num {
  font-size: 14px !important;
}
.erweima {
  position: fixed;
  left: 50%;
  top: 50%;
  margin-top: -328px;
  margin-left: -235px;
  width: 470px;
  height: 623px;
  background-color: #fff;
}
.contactTel {
  font-size: 14px;
}
.contact {
  > div {
    display: inline-block;
    margin-right: 1em;
    > b {
      color: rgb(44, 148, 217);
    }
    i {
      position: relative;
      top: 2px;
    }
  }
}
.tel-box {
  position: fixed;
  background-color: rgba(44, 148, 217, 0.5);
  width: 80px;
  height: 80px;
  font-size: 12px;
  color: #fff !important;
  right: 20px;
  bottom: 118px;
  border-radius: 50%;
  text-align: center;
  line-height: 80px;
}
.fl {
  float: left;
}
.fr {
  float: right;
}
</style>